<template>
	<view class="ad-button-group-view">
		<view class="ad-button" v-for="item in adButtonsData" :key="item.name">
			<image :src="item.icon"></image>
			<view class="text">{{item.name}}</view>
		</view>
		<view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				adButtonsData: [
					{
						name: '美美哒',
						icon: '/static/icon/meimeida.svg'
					},
					{
						name: '香香哒',
						icon: '/static/icon/xiangxiangda.svg'
					},
					{
						name: '舒舒哒',
						icon: '/static/icon/shushuda.svg'
					},
					{
						name: '畅畅哒',
						icon: '/static/icon/changchangda.svg'
					},
					{
						name: '外卖订购',
						icon: '/static/icon/waimaidinggou.svg'
					},
					{
						name: '跑腿服务',
						icon: '/static/icon/paotuifuwu.svg'
					},
					{
						name: '安全出行',
						icon: '/static/icon/anquanchuxing.svg'
					},
					{
						name: '全能帮手',
						icon: '/static/icon/quannengbangshou.svg'
					}
				]
			}
		}
	}
</script>

<style scoped lang="scss">
	.ad-button-group-view {
		width: 710rpx;
		display: flex;
		flex-wrap: wrap;
		background-color: #ffffff;
		margin: 0 20rpx;
		margin-top: 20rpx;
		border-radius: 20rpx;
		
		.ad-button {
			width: 25%;
			text-align: center;
			padding: 20rpx 0;
			
			image {
				width: 120rpx;
				height: 120rpx;
			}
			
			.text {
				
			}
		}
	}
</style>